/* 
 *  Document   : map.js
 *  Created on : 2009年2月15日, 下午1:39
 *  Author     : xthsky
 *  Description:
 *      与地图相关的操作。
 */
/**
 * Kaleidoscope组件初始化部分
 */
$(document).ready(function() {
    initMap('mapDiv', '700', '520', 'Map');
});
function init() {
    Sight.load(sightName);
//    Map.registerEvent("onclick","Test.getInfo");
    Map.registerEvent("onselect","Core.select");
    Map.registerEvent("onmouseover","Core.mouseover");
    Map.registerEvent("onmouseout","Core.mouseout");
    Map.registerEvent("ondblclick","Core.dblclick");
}

var Core = {
	//当前选中的景点 id
	selId: undefined,
	
	/**
	 * 选中景点事件
	 * 效果：在地图上高亮显示选中景点，最多有一个会被选中
	 * 
	 * @param event Map或jQuery的事件对象
	 * 
	 * event可能由Map场景返回，也可能由jQuery绑定事件返回
	 * 代码 “(event.target == null) ? event.id : event.target.id” 判断由哪里返回，实现函数重载
	 * 本文件中event多有此用途
	 */
	select: function(event) {
	    var color = "#ff0000";
	    var alpha = 0.6;

	    if (Core.selId) {
	        Map.clearBackground(Core.selId);
	    }
	    Core.selId = (event.target == null) ? event.id : event.target.id;
	    Map.applyBGColor(Core.selId, color, alpha);
	},
	
	/**
	 * 在景点上悬停事件
	 * 效果：悬停处景点将在地图上高亮显示
	 * 
	 * @param event Map或jQuery的事件对象
	 */
	mouseover: function(event) {
	    var color = "#0000ff";
	    var alpha = 0.4;

	    var id = (event.target == null) ? event.id : event.target.id;
	    Map.dropShadow(id, color, alpha);
		
	    Tooltip.show(event);
	},
	
	/**
	 * 鼠标移出景点事件
	 * 效果：移除悬停效果
	 * 
	 * @param event Map或jQuery的事件对象
	 */
	mouseout: function(event) {
	    var id = (event.target == null) ? event.id : event.target.id;
	    if (Core.selId != id) {
	        Map.clearBackground(id);
	    }
	    else
	        Core.select(event);
	    
	    Tooltip.hide();
	},
	
	/**
	 * 双击景点事件
	 * 效果：加载子场景
	 * 
	 * @param event Map或jQuery的事件对象
	 */
	dblclick: function(event) {
		var id = (event.target == null) ? event.id : event.target.id;
		var name = $('#'+id).text();
		//Sight.load(id);
		location.href = Sight.host + "sight/" + encodeURIComponent(name);
	},
	
	prepareLabel: function() {
		Core.selId = undefined;
		Map.registerEvent("onclick","Core.newLabel");
		Map.setLabelEditable(true);
	},
	newLabel: function(event) {
		if(event == null) {
		    var x = Map.getMouse("x");
		    var y = Map.getMouse("y");
		    var width = '40';
		    var height = '30';
		    var url = 'http://cpc.sjtu.edu.cn/map/pic/mark.png';
		    Core.selId = Map.label(x,y,width,height,url);
		}
		else {
			$("#info").text("already exist point.");
			for(var key in event) {
				$("#info").append(key+':'+event[key]+'<br>');
			}
		}
	},
	
	editLabel: function() {
	}
};


var Tooltip = {
	/**
	 * 定位悬浮框
	 * 
	 * @param event Map或jQuery的事件对象
	 */
	position: function(event) {
	    if (event.target != null) {
	    	event = Map.getItem(event.target.id);
	    }
		var mapPosition = $('#mapDiv').position();
		var tPosX = mapPosition.left + event.x;
	    var tPosY = mapPosition.top + event.y;
	    $('div.tooltip').css({
	        top: tPosY,
	        left: tPosX
	    });
	},
	
	/**
	 * 显示悬浮框
	 * 
	 * @param event Map或jQuery的事件对象
	 */
	show: function(event) {
	    $('div.tooltip').remove();
	    var $item = Sight.$xml.find('[mapId=' + ((event.target == null) ? event.id : event.target.id) + ']');
	    var html = '<div class="tooltip">';
	    if($item.attr('url') != null)
	        html += '<span style="font-style: italic;">双击可查看该场景详细信息</span><br>';
	    html += '<span>票价：' + $item.attr('price') + '</span><div>' + $item.find('description').text() + '</div></div>'
	    $(html).appendTo('body');
	    Tooltip.position(event);
	},
	
	/**
	 * 隐藏悬浮框
	 */
	hide: function() {
	    $('div.tooltip').remove();
	}
};


var Test = {
	/**
	 * 显示选中项信息
	 * 效果：在#result中显示选中项信息，测试用
	 * 
	 * @param event Map或jQuery的事件对象
	 */
	getInfo: function(event) {
		if(event != null) {
			for(var key in event) {
				document.all("result1").value += key+':'+event[key]+'\r\n';
				document.all("result1").scrollTop = document.all("result1").scrollHeight;
			}
		}
	}
};
